import React, {Component} from 'react';
import './index.less';
import {base, cacheTools} from 'nc-lightapp-front';

const {NCCheckbox, NCSelect, NCInput} = base;

class SearchTop extends Component {
    constructor(props) {
        super(props);
        this.state = {
            querylast: false,
            termOperator: '1',
            termFromStr: '',
            termToStr: '',
            contTermStr: '',
            termUint: '2',
            propOperator: '1',
            propFromStr: '',
            propToStr: '',
            contPropStr: '',
            propUint: '2'
        };
        this.getData = this.getData.bind(this);
    }

    onchange = (key, val) => {
        // debugger
        let keysArr = ['termFromStr', 'contTermStr', 'termToStr', 'propFromStr', 'contPropStr', 'propToStr'];
        if (keysArr.includes(key) && (isNaN(val) || val > 9999)) {
            return false
        }
        this.setState({
            [key]: val
        })
    };

    getData() {
        return this.state;
    }

    clearData() {
        this.setState({
            querylast: false,
            termFromStr: '',
            termToStr: '',
            contTermStr: '',
            propFromStr: '',
            propToStr: '',
            contPropStr: ''
        })
    }

    render() {
        const {json, isAgree} = this.props;
        const {
            querylast, termOperator, termFromStr, termToStr, contTermStr, termUint,
            propOperator, propFromStr, propToStr, contPropStr, propUint
        } = this.state;
        const selectData = [
            {
                key: json["cm6011-000075"],
                value: '1'
            },
            {
                key: json["cm6011-000076"],
                value: '2'
            },
            {
                key: json["cm6011-000077"],
                value: '3'
            },
            {
                key: json["cm6011-000078"],
                value: '4'
            },
            {
                key: json["cm6011-000079"],
                value: '5'
            },
            {
                key: json["cm6011-000080"],
                value: '6'
            }
        ];
        const selectUnitData = [
            {
                key: json["cm6011-000081"],
                value: '1'
            },
            {
                key: json["cm6011-000082"],
                value: '2'
            },
            {
                key: json["cm6011-000083"],
                value: '3'
            }
        ];
        return (
            <div className="search-top-area">
                <div>
                    <div className={'checkbox'}>
                        <NCCheckbox checked={querylast} onChange={val => {
                            this.onchange('querylast', val)
                        }}>{json['cm6011-000086']}</NCCheckbox>{/* 国际化处理： 仅查最新纪录*/}
                    </div>
                    <div className={'contract-term'}>
                        <div className={'contract-term-item'}>
                            <div className={'contract-unit'}>
                                <span>{isAgree ? json['cm6011-000103'] : json['cm6011-000085']}</span>
                                <NCSelect
                                    className={'select-box'}
                                    onChange={(val) => {
                                        this.onchange('termOperator', val);
                                    }}
                                    value={termOperator}
                                    data={selectData}
                                />
                            </div>
                            <div className={'contract-time'}>
                                {termOperator === '1' ? <div>
                                    <NCInput type="text" value={termFromStr} onChange={val => {
                                        this.onchange('termFromStr', val)
                                    }}/>
                                    <NCInput type="text" value={termToStr} onChange={val => {
                                        this.onchange('termToStr', val)
                                    }}/>
                                </div> : <div>
                                    <NCInput type="text" value={contTermStr} onChange={val => {
                                        this.onchange('contTermStr', val)
                                    }}/>
                                </div>}
                            </div>
                            <div className={'contract-unit'}>
                                <span>{json['cm6011-000087']}</span>
                                <NCSelect
                                    className={'select-box'}
                                    onChange={(val) => {
                                        this.onchange('termUint', val);
                                    }}
                                    value={termUint}
                                    data={selectUnitData}
                                />
                            </div>
                        </div>
                        <div className={'contract-term-item'}>
                            <div className={'contract-unit'}>
                                <span>{json['cm6011-000088']}</span>
                                <NCSelect
                                    className={'select-box'}
                                    onChange={(val) => {
                                        this.onchange('propOperator', val);
                                    }}
                                    value={propOperator}
                                    data={selectData}
                                />
                            </div>
                            <div className={'contract-time'}>
                                {propOperator === '1' ? <div>
                                    <NCInput type="text" value={propFromStr} onChange={val => {
                                        this.onchange('propFromStr', val)
                                    }}/>
                                    <NCInput type="text" value={propToStr} onChange={val => {
                                        this.onchange('propToStr', val)
                                    }}/>
                                </div> : <div>
                                    <NCInput type="text" value={contPropStr} onChange={val => {
                                        this.onchange('contPropStr', val)
                                    }}/>
                                </div>}
                            </div>
                            <div className={'contract-unit'}>
                                <span>{json['cm6011-000087']}</span>
                                <NCSelect
                                    className={'select-box'}
                                    onChange={(val) => {
                                        this.onchange('propUint', val);
                                    }}
                                    value={propUint}
                                    data={selectUnitData}
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
}

export default SearchTop;
